<!DOCTYPE html>
<html>
    <head>
       <title>Student Map</title>
    </head>
    <body>
        <h1>Student Map</h1>
        <h2>Enter Your Information</h2>
        <form action="/" method="post">
            Name: <input type="text" name="name">
            Location<input type="text" name="location">
            <input type="submit">
        </form>
        <h3>Map</h3>
        <img src= "https://chart.googleapis.com/chart?cht=map:fixed=-60,-180,80,180&chs=500x500&chco=CCCCCC|FF0000&chld={{ locations }}&chm={{ names }}"alt="Map">
      
        <form action="/" method="post">
            {% for student in students %}
                <div>
                  <input type="checkbox" name="student" value="{{ student.key }}">
                  {{ student.name }}: {{ student.location }}</div>
            {% endfor %}
            <input type="submit" value="Delete">
        </form>
    </body>
</html>

